<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8" />
    <title>你好啊</title>
    <link  rel="icon" href="pic_03.jpg" type="image/jpg" sizes="200x200" >

    <!--<script defer src="http://www.baidu.com" onload="alert('a')"></script>
    <script async src="http://www.baidu.com" onload="alert('b')"></script>-->
</head>



<body>
<form>
    <input type="checkbox" checked/>
    <input type="text" value="hint" />
    <input type="search" />
    <input type="button" value="click me" />
    <input type="radio" />
    <input type="radio" checked/>
    <input type="text" value="提示" />
    <br />
    <p>测试1</p>
    <p>测试2</p>
    <h1>你是中国人1</h1>
    <h2>你是中国人2</h2>
    <h3>你是中国人3</h3>
    <h4>你是中国人4</h4>
    <h5>你是中国人5</h5>
    <h6>你是中国人6</h6>
    <video src="test.mp4" controls="controls">videoDemo</video>
    <br />
</form>

<p>我是<mark>ssm</mark>中国人mark标签</p>

<h3>进度条progress</h3>
<p><progress max="100" value="88"><span>85</span></progress></p>

<h3>Time标签</h3>
<p><time datetime="2016-12-26T22:43Z" pubdate="">22:45</time></p>

<h3>ruby注释？</h3>
<p><ruby>"龙"<rt></rt>中国龙的传说<rp></rp></ruby></p>

<h3>wbr软换行</h3>
<p>"这是一段很长的描述内容，"<wbr></wbr>"相当长的一段"</p>

<h3>canvas绘制</h3>
<p><canvas id="my_canvas" width="100" height="100"></canvas></p>
<script>
    var canvas = document.getElementById('my_canvas');
    var ctx = canvas.getContext('2d');
    ctx.fillStyle = '#ff2233';
    ctx.fillRect(10, 10, 100, 100);
</script>

<h3>detail展示更多</h3>
<details>
    <summary>这是关于Html5新特性的介绍</summary>
    <ul>
        <li>特性1</li>
        <li>特性2</li>
        <li>特性3</li>
        <li>特性4</li>
        <li>特性5</li>
    </ul>
</details>


<h3>datalist历史记录</h3>
<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">
    <input id="myCar" list="cars">
    <datalist id="cars">
        <option value="ABC"></option>
        <option value="BCD"></option>
        <option value="CDF"></option>
    </datalist>
</form>

<h3>Keygen加密</h3>

<a href="http://www.sina.com" target="_blank">跳转到新浪</a>

<p><a media="handheld" href="http://www.baidu.com">百度页面适配手机</a></p>
<p><a media="tv" href="http://www.baidu.com">百度页面适配TV</a></p>

<ol start="50" >
    <li>张三-正序</li>
    <li>李四-正序</li>
    <li>王五-正序</li>
</ol>

<ol start="50" reversed>
    <li>张三-倒序</li>
    <li>李四-倒序</li>
    <li>王五-倒序</li>
</ol>

<menu type="toolbar" label="menu">
    <li>张三-倒序</li>
    <li>李四-倒序</li>
    <li>王五-倒序</li>
</menu>

<iframe seamless src="https://www.baidu.com" width="800" height="400">内嵌页面</iframe>
<!--<iframe seamless sandbox src="https://www.baidu.com"></iframe>-->

</body>

</html>